<template>
  <div>
        <!-- seach区域 -->
        <div class="seach">
            <span>
                <!-- {{$t('mertnam')}}
                <el-input v-model="selectParam.merName" :placeholder="$t('plsipt')" size="mini"></el-input>
                {{$t('mertid')}}
                <el-input v-model="selectParam.merId" :placeholder="$t('plsipt')" size="mini"></el-input> -->
                {{$t('mersta')}}
                <el-select v-model="selectParam.status" :placeholder="$t('plsset')" size="mini">
                    <el-option :label="'-' + $t('plsset') + '-'" :value="null"></el-option>
                    <el-option :label="$t('new')" value="CREATE"></el-option>
                    <el-option :label="$t('submitted')" value="SUBMITTED"></el-option>
                </el-select>
            </span>
            <el-button type="primary" @click="select" size="mini" v-preventReClick>{{$t('qury')}}</el-button>
        </div>
        <!-- 内容区域 -->
        <el-card class="cardBox">
            <el-table border style="width: 100%" :data="regmerlistTab">
                <el-table-column type="index" :label="$t('sernum')">
                </el-table-column>
                <el-table-column prop="merId" :label="$t('mertid')">
                </el-table-column>
                <el-table-column prop="meracc" :label="$t('registeracc')">
                </el-table-column>
                <el-table-column prop="status" :label="$t('mersta')">
                </el-table-column>
                <el-table-column prop="regTime" :label="$t('registrationtime')">
                </el-table-column>
                <!-- <el-table-column :label="$t('opratn')" width="90" fixed="right">
                    <template slot-scope="scope">
                        <el-link type="primary" @click="detail(scope.row)">{{$t('detls')}}</el-link>
                    </template>
                </el-table-column> -->
            </el-table>
            <!-- 分页 -->
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="selectParam.pageNum"
                :page-sizes="[10, 15, 20, 30]"
                :page-size="selectParam.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
            </el-pagination>
        </el-card>
    </div>
</template>

<script>
import {
  getregmerlist
} from '@/libs/reqlist.js'
export default {
  data () {
    return {
      total: 0,
      selectParam: {
        orderParamIdx: null,
        orderType: null,
        pageNum: 1,
        pageSize: 10,
        status: null
      },
      regmerlistTab: []
    }
  },
  methods: {
    getregmerList () {
      getregmerlist(JSON.stringify(this.selectParam)).then(res => {
        if (res.data.code === '000000') {
          this.total = res.data.data.total - 0
          this.regmerlistTab = res.data.data.list
          this.regmerlistTab.forEach(item => {
            item.merId = item.merId + ''
            if (item.status === 'CREATE') item.status = this.$t('new')
            if (item.status === 'SUBMITTED') item.status = this.$t('submitted')
            if (item.mobile !== null) {
              item.meracc = item.mobile
            } else {
              item.meracc = item.email
            }
          })
        }
      })
    },
    select () {
      this.selectParam.pageNum = 1
      this.getregmerList()
    },
    handleSizeChange (newSize) {
        this.selectParam.pageSize = newSize
        this.getregmerList()
    },
    // 监听总页数变化
    handleCurrentChange (newNum) {
        this.selectParam.pageNum = newNum
        this.getregmerList()
    },
    detail () {}
  },
  mounted () {
    this.getregmerList()
  }
}
</script>

<style lang="less" scoped>
@import './inactivemer.less';
</style>
